html,body,#app{
  background-color: #F8F8F8 !important;
}
.body{
  background-color: #F8F8F8 !important;
}
.page_body{
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 9rem;
}
.body /deep/ .van-nav-bar .van-icon{
  color: #0A0A0A !important;
}
.body /deep/ .van-nav-bar__arrow{
  font-size:1.09rem;
  font-weight: bold;
}
.body /deep/ .van-nav-bar__title{
  color: #585858;
  font-size: 1.06rem;
}
.content_body{
  width: 93.87%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.content_title{
  width: 100%;
  height: 2.81rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #008BFF;
  font-size: 0.88rem;
  border-bottom: 0.06rem solid #EEEEEE;
}
.content_title_right{
  width: 3.44rem;
  height: 1.25rem;
  border: 0.06rem solid #DFDFDF;
  border-radius: 10rem;
  font-size: 0.75rem;
  color: #444444;
  display: flex;
  align-items: center;
  justify-content: center;
}
.content_title_img{
  width: 0.56rem;
  height: 0.69rem;
  margin-right: 0.22rem;
}
.content_description{
  width: 100%;
  padding: 0.75rem 0 0.59rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #444444;
  font-size: 0.88rem;
  border-bottom: 0.06rem solid #EEEEEE;
}
.content_description_bottom{
  width: 100%;
  display: flex;
  justify-content: space-between;
  color: #008BFF;
  margin-top: 1.5rem;
}
.content_description_content{
  width: 100%;
  word-break: break-all;
  line-height: 1.14rem;
  margin: 0.7rem 0;
}
.content_description_text{
   /*! autoprefixer: off */
  position: relative;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
  /*! autoprefixer: on */
}
.content_description_trafficText{
  /*! autoprefixer: off */
  position: relative;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
  /*! autoprefixer: on */
}
.content_description_expansionText{
  position: relative;
  word-break: break-all;
}
.content_description_white{
  width: 3.5rem;
  height: 1.1rem;
  display: flex;
  justify-content: flex-end;
  position: absolute;
  bottom: 0;
  right: 3.5rem;
  z-index: 3;
  background-image: linear-gradient(to right, rgba(248, 248, 248,0) , rgba(248, 248, 248,1));
}
.content_description_blue{
  width: 3.7rem;
  height: 1.1rem;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 5;
  background-color: #F8F8F8;
  color: #3A99E5;
  font-size: 0.69rem;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.content_location_content{
  width: 100%;
  color: #444444;
  font-size: 0.75rem;
  margin-top: 0.72rem;
}
.content_select_title{
  width: 100%;
  font-size: 1rem;
  color: #555555;
  margin-top: 1.75rem;
}
.content_select_tag{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  font-size: 0.81rem;
  margin-top: 0.84rem;
}
.content_select_tag_once{
  padding: 0.46rem 0.56rem 0.44rem;
  border-radius: 10rem;
  color: #999999;
  background-color: #EEEEEE;
  display: flex;
  align-items: center;
  margin: 0 0.17rem 0.32rem;
  transition: all 0.3s;
}
.content_select_tag_once2{
  padding: 0.46rem 0.56rem 0.44rem;
  border-radius: 10rem;
  color: #FFFFFF;
  background-color: #01A862;
  display: flex;
  align-items: center;
  margin: 0 0.17rem 0.32rem;
  transition: all 0.3s;
}
.content_select_tag_img{
  width: 0.78rem;
  height: 0.78rem;
  margin-right: 0.28rem;
}
.content_select_white{
  width: 100%;
  height: 12.5rem;
  background-color: #FFFFFF;
  border:0.03px solid rgba(238, 238, 238, 1);
  margin-top: 0.69rem;
  border-radius: 0.28rem;
  padding: 1.34rem 0.78rem;
  box-sizing: border-box;
  font-size: 0.88rem;
  color: #484848;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

}
.content_select_white_once{
  width: 100%;
  display: flex;
  align-items: center;
  /* margin: 1.34rem 0; */

}
.content_select_rate{
  margin-left: 2.47rem;
}
.content_select_rate /deep/ .van-rate__icon{
  font-weight: bold;
}
.content_select_state{
  font-size: 0.69rem;
  color: #757575;
  margin-left: 0.81rem;
  margin-top: 0.1rem;
}
.play_border{
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 1.59rem;
}
.play_once{
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}
.play_left{
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-left: 0.75rem;
  justify-content: space-between;
  position: absolute;
}
.play_left_circle{
  width: 1.43rem !important;
  height: 1.43rem !important;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.75rem;
  color: #CED2DE;
  border: 0.13rem solid #CED2DE;
  background-color: #EDF2F2;
}
.play_left_line{
  width: 0.19rem;
  height: calc(100% - 1.56rem);
  background-color: #CED2DE;
}
.play_right{
  height: 100%;
  width: 85.1%;
  margin-left: 2.66rem;
  /* position: absolute; */
}
.play_right_title{
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.play_right_title_right{
  display: flex;
  align-items: center;
  font-size: 1.13rem;
  color: #303030;
  padding-left: 0.66rem;
  box-sizing: border-box;
}
.play_right_title_time{
  font-size: 0.75rem;
  color: #999999;
  margin-left: 0.69rem;
}
.play_right_title_left{
  display: flex;
  align-items: center;
  font-size: 0.75rem;
  color: #555555;
}
.play_right_title_left_once{
  padding: 0.26rem 0.78rem;
  background-color: #FAFAFA;
  border: 0.06rem solid #EEEEEE;
  border-radius: 10rem;
}
.play_white{
  width: 100%;
  /* height: 17rem; */
  background-color: #FFFFFF;
  border-radius: 1rem;
  margin-top: 0.63rem;
  margin-bottom: 1.59rem;
  box-sizing: border-box;
  padding: 0.8rem 0;
  position: relative;
}
.play_white_title{
  width: 100%;
  color: #000000;
  font-size: 1.13rem;
  padding-top: 1.06rem;
  padding-left: 0.78rem;
  box-sizing: border-box;
}
.play_swipe{
  width: 100%;
  height: 87.5px;
  padding-left: 0.63rem;
  box-sizing: border-box;
  margin-top: 0.84rem;
  /* height: 87.5px; */

}
.play_white /deep/ .van-swipe__track{
  display: flex;
}
.play_swipe_item{
  /* margin: ; */
  width: 87.5px !important;
  height: 87.5px !important;
  margin-right: 10px;
  border-radius: 0.8rem;
  overflow: hidden;
}
.play_swipe_item2{
  width: 87.5px;
  height: 87.5px;
  /* background-color: #00FFFF; */
  margin-right: 0.47rem;
  border-radius: 0.8rem;
  overflow: hidden;
}
.play_swipe_once{
  width: 100%;
  height: 100%;
}
.play_content_text{
  width: 100%;
  margin-top: 0.97rem;
  font-size: 0.69rem;
  color: #000000;
  padding: 0 0.63rem;
  box-sizing: border-box;
  line-height: 1.2rem;
}
.play_button_border{
  width: 100%;
  display: flex;
  justify-content: flex-end;
}
.play_button{
  padding: 0.38rem 1.41rem;
  font-size: 0.75rem;
  color: #555555;
  border: 0.06rem solid #EEEEEE;
  border-radius: 10rem;
  margin-right: 0.75rem;
  background-color: #FAFAFA;
}
.addJourneyButton_border{
  width: 100%;
  display: flex;
  justify-content: flex-end;

}
.addJourneyButton{
  width: 19.38rem;
  height: 2.81rem;
  margin-right: 0.75rem;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.94rem;
  color: #525356;
  border-radius: 10rem;
  border: 0.06rem solid #DFDFDF;
  margin-top: 1rem;
  background-color: #FFFFFF;
}
.fixed_white{
  width: 100%;
  height: 4.59rem;
  background-color: #FFFFFF;
  display: flex;
  align-items: center;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 10;
}
.fixed_white_edit{
  width: 100%;
  height: 4.59rem;
  background-color: #FFFFFF;
  display: flex;
  align-items: center;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 10;
  justify-content: center;
}
.fixed_left{
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 0.63rem;
  color: #6A6A6A;
  margin-left: 1.19rem;
}
.fixed_left_img_bg{
  width: 1.88rem;
  height: 1.88rem;
  border-radius: 50%;
  background-color: #F5F5F5;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0.25rem;
}
.fixed_left_img{
  width: 0.97rem;
  height: 0.97rem;
  position: absolute;
}
.fixed_right_button{
  width: 77.33%;
  height: 2.81rem;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  color: #FFFFFF;
  background-color: #01A862;
  border-radius: 10rem;
  margin-left: 1.16rem;
}
.fixed_right_button_edit{
  width: 77.33%;
  height: 2.81rem;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  color: #FFFFFF;
  background-color: #01A862;
  border-radius: 10rem;
  /* margin-left: 1.16rem; */
}

.write_white{
  width: 100%;
  height: 3.75rem;
  margin: 0.32rem 0;
  background-color: #FFFFFF;
  border-radius: 0.31rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #008BFF;
  font-size: 0.88rem;
}

.content_description_border{
  width: 100%;
  /* padding: 0.75rem 0 0.59rem; */
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #444444;
  font-size: 0.88rem;
}
.play_add_road{
  width: 95%;
  height: 3.53rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #008BFF;
  font-size: 0.88rem;
  background-color: #F2F3F5;
  border-radius: 0.47rem;
  margin-left: 0.66rem;
  margin-top: 1.25rem;
  margin-bottom: 1.6rem;
}


.upload_class{
  width: 100%;
  height: 5.75rem;
  margin: 0.32rem 0;
  background-color: #FFFFFF;
  border-radius: 0.31rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #008BFF;
  font-size: 0.88rem;
}
.upload_view{
  width: 100%;
  height: 100%;

  display: flex;
  justify-content: center;
  align-items: center;
}
.upload_class /deep/ .van-uploader__wrapper{
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.upload_class /deep/ .van-uploader__preview{
  width: 100%;
  height: 100%;
  margin: 0;
}
.upload_class /deep/ .van-uploader__preview-image{
  width: 100%;
  height: 100%;
}
.write_white_city{
  color: #333333;
  display: flex;
  justify-content: center;
  align-items: center;
}
.cityvalue_line{
  width: 0.6rem;
  height: 0.06rem;
  background-color: #333333;
  margin: 0 0.5rem;
  display: block;
}

.play_white_address{
  position: absolute;
  top: 0.7rem;
  right: 0.9rem;
  font-size: 0.8rem;
  color: #333333;
  width: 50%;
  text-align: right;
}

.write_white_input_border{
  display: flex;
  justify-content: center;
  align-items: center;
}
.write_white_input{
  width: 30%;
  border: 0.06rem solid #D3D3D3;
  padding: 0.3rem 0.4rem;
  border-radius: 20rem;
  text-align: center;
}
